<!--
 * @description  : 市管-工作照片管理
 * @descriptionDetail: 市管-工作照片管理
 * @copyright    : 浙江烟草
 * @author       : sy
 * @create       : 2022-07-09 18:43:02
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :isWhite="true" backText="返回" title="工作照片管理"></theme-navbar>
    <!-- #endif -->
    <view class="content">
      <view class="info-content">
        <view class="info-box">
          <u-form :model="evidenceForm" :errorType="['border-bottom','message',]" ref="uForm">
            <u-form-item label="工作照片" :required="true" prop="fileList" label-position="top">
              <m-upload
                :deletable="!readOnly"
                width="150rpx"
                height="150rpx" 
                :file-list="officialPicList"
                :multiple="false"
                :disabled="readOnly"
                index="officialPicList"
                :uploadParam="{'fiGroupCode':'check'}"
                upApiUrl="uploadBase64File"
                @on-list-change="changeUpload"
              >
              </m-upload>
            </u-form-item>
            <u-form-item label="工作照说明" label-position="top">
              <u-input 
                :border="false" 
                :disabled="readOnly" 
                type="textarea" 
                placeholder="请输入说明" 
                v-model="evidenceForm.notes"
              >
              </u-input>
            </u-form-item>
          </u-form>
        </view>
      </view>      
      <view class="space-content"></view>
      <u-button plain class="flat-btn" type="primary" v-if="!readOnly" @click="confirmHandle">
        保存
      </u-button>
    </view>
  </view>
</template>

<script>
import common from "@/components/commonMixins.js";
import mUpload from '@/components/m-upload.vue';
import checkService from "@/service/check/check.service";
export default{
  components:{
    mUpload,
  },
  mixins: [common,],
  data() {
    return {
      officialPicList:[], // 存放图片列表
      readOnly:false,
      caseCode:'',
      evidenceForm:{
        notes:"",
      },
      checkUuid:"",
    }
  },
  mounted() {
  },
  // 加载初始周期方法
  onLoad() {
    let preParams = this.getRouteParam();
    if(preParams){
      this.readOnly = preParams.readOnly;
      // this.officialPicList = preParams.fileList;
      this.checkUuid = preParams.checkUuid;
      this.$modal.showLoading("加载中...");
      checkService.findByCheckUuid(this.checkUuid).then(res => {
        this.$modal.hideLoading();
        if(res.success && res.bean){
          this.officialPicList = res.bean.files;
          this.evidenceForm.notes = res.bean.notes;
          if(!this.officialPicList){
            this.officialPicList = [];
          }
        }
      }).catch(e => {
        this.$modal.hideLoading();
      });
    }
  },
  methods: {
    // 上传/删除图片事件
    changeUpload(list, key){
      if(list.length > 0){
        this.officialPicList = [...list,];
      }else{
        this.officialPicList = [];
      }
    },
    // 确定
    confirmHandle(){
      let files = [];
      this.officialPicList.forEach(item => {
        files.push(item);
      });
      this.evidenceForm.files = files;
      this.$refs.uForm.validate(valid => {
        if (valid) { 
          if(files.length == 0){
            this.$u.toast('请上传照片');
            return;
          }
          if(this.evidenceForm.notes == undefined){
            this.evidenceForm.notes = "";
          }
          this.evidenceForm.checkUuid = this.checkUuid;
          this.$modal.showLoading("正在保存...");
          checkService.saveOrUpdateCheckDesc(this.evidenceForm).then(res => {
            this.$modal.hideLoading();
            if(res.success){
              uni.navigateBack();
            }else{
              this.$modal.toast(res.msg);
            }
          }).catch(e => {
            this.$modal.hideLoading();
            console.log(e);
            this.$modal.toast("保存失败");
          });
        } else {
          console.log('表单验证失败');
        }
      });
    },
  },
	
}
</script>

<style lang="scss" scoped>
	@import "../case/case_common.scss";
	.content{
		.info-content{
			padding: 10px 16px 16px;	
			.zj-photo-content{
				min-height: 80px;
				.photo-item{
					padding: 10px;
				}
			}
		}	
	}
</style>
